<template>
    <div>
        <r-search :searchForm="searchForm" :searchHandle="searchHandle" :searchData="searchData" />
        <r-table :isIndex="true" :isPagination="true" :tableData="tableData" :tableCols="tableCols" :tablePage="tablePage" @refresh="init()"></r-table>
        <!-- <r-form :formRules="formRules" :formHandle="formHandle" :formData="formData" :formCols="formCols" ref="elForm" labelWidth="100px" dialogWidth="500px" :isHandle="true" /> -->
    </div>
</template>
<script>
export default {
    data() {
        return {
            searchData: {
                orderNo: '',
                // deviceId: '',
                agentName: '',
                merchantName: '',
                state: '',
                etime: '',
                order_type: 2
            },
            searchForm: [
                {
                    type: 'input',
                    prop: 'orderNo',
                    placeholder: '订单编号',
                    width: 150
                },
                {
                    type: 'input',
                    prop: 'nickName',
                    placeholder: '下单用户',
                    width: 150
                },
                {
                    type: 'select',
                    prop: 'agentName',
                    placeholder: '代理商',
                    width: 130,
                    options: [
                    ]
                },
                {
                    type: 'select',
                    prop: 'merchantName',
                    placeholder: '商家',
                    width: 120,
                    options: [
                    ]
                },
                {
                    type: 'select',
                    prop: 'state',
                    placeholder: '订单状态',
                    width: 150,
                    options: [
                        {
                            label: '已创建',
                            value: '0'
                        },
                        {
                            label: '待接单',
                            value: '1',
                        },
                        {
                            label: '待配送',
                            value: '2',
                        },
                        {
                            label: '已送达',
                            value: '3',
                        },
                        {
                            label: '已完成',
                            value: '4',
                        },
                        {
                            label: '已销毁',
                            value: '5',
                        },
                        {
                            label: '已取消',
                            value: '6',
                        },
                        {
                            label: '申请售后',
                            value: '7',
                        },
                        {
                            label: '已退款',
                            value: '8',
                        },
                        {
                            label: '不退款',
                            value: '9',
                        },
                        {
                            label: '已超时',
                            value: '10',
                        },
                    ]
                },
                {
                    type: 'date',
                    prop: 'etime',
                    placeholder: '提交时间',
                    width: 170,
                    options: [
                    ]
                },
            ],
            searchHandle: [
                {
                    label: '搜索',
                    type: 'success',
                    icon: 'el-icon-search',
                    handle: e => this.init()
                },
                {
                    label: '重置',
                    icon: 'el-icon-refresh-right',
                    handle: e => this.searchFromReset()
                },
                {
                    label: "导出Excel",
                    icon: 'el-icon-download',
                    type: "success",
                    loading: false,
                    handle: (that) => this.handleDownload(),
                },
            ],
            tableData: [
            ],
            tableCols: [
                {
                    label: '订单编号',
                    prop: 'orderNo',
                    // theme: e => e.status ? 'primary' : 'danger', type: "tag",
                },
                {
                    label: '提交时间',
                    prop: 'createdTime'
                },
                {
                    label: '设备编号',
                    prop: 'equipmentNo'
                },
                {
                    label: '所属商家',
                    prop: 'merchantName'
                },
                {
                    label: '支付金额',
                    prop: 'actuallyPaidMoney'
                },
                {
                    label: '支付方式',
                    prop: 'payType',
                    formatter: e => e.payType == 1 ? "微信" : e.payType == 2 ? '支付宝支付' : e.payType == 3 ? 'ic卡支付' : ''
                },
                {
                    label: '订单状态',
                    prop: 'state',
                    formatter: e => e.state == 0 ? '已创建' : e.state == 1 ? '待接单' : e.state == 2 ? '待配送' : e.state == 3 ? '已送达' : e.state == 4 ? '已完成' : e.state == 5 ? '已销毁' : e.state == 6 ? '已取消' : e.state == 7 ? '申请售后' : e.state == 8 ? '已退款' : e.state == 9 ? '不退款' : e.state == 10 ? '已超时' : ''
                },
                {
                    label: '操作',
                    type: "button",
                    btnList: [
                        {
                            label: '订单详情',
                            type: 'primary',
                            // isShow: e => e.orderNo == '123' ? true : false,
                            handle: (row) => this.goDetail(row.id)
                        }
                    ]
                }

            ],
            tablePage: { limit: 10, page: 1, total: 0 },

        };
    },
    components: {},
    computed: {},
    mounted() {
        this.init()
    },
    methods: {
        async init() {
            let param = { ...this.searchData, ...this.tablePage }
            let res = await this.api.cardorder(param)
            if (res) {
                this.tablePage.total = res.data.total
                this.tableData = res.data.list
            }
            let operatorId = ''
            let resOpt = await this.api.getOperatorList({})
            if (resOpt) {
                operatorId = resOpt.data.operatorId
            }
            let resAgent = await this.api.getAgentList({
                userId: operatorId
            })
            let resMerchant = await this.api.getMerchantList({
                userId: operatorId
            })
            if (resAgent) {
                // this.searchForm[2].options = resAgent.data
                this.searchForm[2].options = []
                for (let i = 0; i < resAgent.data.length; i++) {
                    this.searchForm[2].options.push({
                        label: resAgent.data[i].name,
                        value: resAgent.data[i].name
                    })
                }
            }
            if (resMerchant) {
                this.searchForm[3].options = []
                for (let i = 0; i < resMerchant.data.length; i++) {
                    this.searchForm[3].options.push({
                        label: resMerchant.data[i].name,
                        value: resMerchant.data[i].name
                    })
                }
            }
        },
        //查询
        elFormSubmit() {

        },
        goDetail(id) {
            this.$router.push({ path: '/order-cardSale_Detail', query: { id } })
        },
        formatJson(filterVal, jsonData) {
            return jsonData.map(v => filterVal.map(j => {
                // if (j === 'connectedStatus') {
                //     return v[j] == 1 ? "在线" : "离线"
                // } else if (j === 'status') {
                //     return v[j] == 1 ? "正常" : v[j] == 2 ? "设备维护中" : "未激活"
                // } else {
                return v[j]
                // }
            }))
        },
    }
};
</script>
<style scoped lang='scss'>
.el-icon-search {
  margin-right: 10px;
}
</style>
